<template>
  <div>
    <el-dialog title="删除"
               top="150px"
               :visible.sync="delCUser"
               :close-on-press-escape="false"
               :close-on-click-modal="false"
               :before-close="closeModel"
               append-to-body>
      <hr class="boundary">
      <div class="body">
        <div class="tip">是否删除该用户？</div>
      </div>
      <hr class="boundary">
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeModel">关 闭</el-button>
        <el-button type="danger" @click="clickDel">删 除</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>

  export default {
    props: {
      delId: String,
      delCUser: Boolean
    },
    data () {
      return {
        showDel: false
      }
    },
    methods: {
      clickDel () {
        let self = this
        $.ajax({
          type: 'DELETE',
          url: this.api + 'users',
          headers:{
            'X-Requested-With': 'XMLHttpRequest'
          },
          xhrFields: {
            withCredentials: true
          },
          data: {
            'id': self.delId,
          },
          success (data) {
            let jsonData = JSON.parse(data)
            if (jsonData === true) {
              self.$message({
                message: '删除成功！',
                type: 'success'
              })
              self.closeModel()
            } else if (jsonData.status === 1) {
              self.$message.error('删除失败！')
            }
          }
        })
      },
      closeModel () {
        this.showDel = false
        // this.$emit('showBrandsList')
        this.$emit('closeModel')
      }
    },
  }
</script>

<style scoped>
  @import "../../../assets/public/subModal.css";

  .el-dialog__wrapper >>> .el-dialog {
    width: 430px;
  }

  .body {
    position: relative;
    height: 150px;
    text-align: center;
  }

  .tip {
    line-height: 150px;
    font-size: 23px;
    letter-spacing: 1px;
  }

  .el-button {
    margin: 0 0 0 10px;
  . font-size: 15 px;
    padding: 10px 20px;
  }
</style>
